<template>
  <div class="body">
    <nut-navbar @on-click-back="$router.back()" :rightShow="false">会场列表</nut-navbar>
    <div class="container container-bg">

       <nut-row>
          <nut-col :span="24">

              <div class="schedule-list" v-for="(vo,index) in list1" :key="index" @click="goSchedule(vo.venue_id)">
                  <nut-col :span="5">
                    <img src="../../assets/icon/goods.png" alt="">
                  </nut-col>
                  <nut-col :span="19">
                      <div class="title-content">
                        <nut-col :span="24">
                            {{vo.venue_title}}    
                        </nut-col>
                        <div class="title-l">
                        <nut-col :span="8">
                          {{vo.site_floor}}层
                        </nut-col>
                        <nut-col :span="8">
                          {{vo.site_area}}平
                        </nut-col>
                        <!-- <nut-col :span="7">
                          80*80*80
                        </nut-col> -->
                        <nut-col :span="8">
                          {{vo.site_size}}人
                        </nut-col>
                        </div>
                      </div> 
                  </nut-col>
              </div>

              <!-- <div class="schedule-list">
                  <nut-col :span="5">
                    <img src="../../assets/icon/goods.png" alt="">
                  </nut-col>
                  <nut-col :span="19">
                      <div class="title-content">
                        <nut-col :span="24">
                            2019年奇点科技年会    
                        </nut-col>
                        <div class="title-l">
                        <nut-col :span="4">
                          楼层
                        </nut-col>
                        <nut-col :span="4">
                          面积
                        </nut-col>
                        <nut-col :span="8">
                          长宽高尺寸
                        </nut-col>
                        <nut-col :span="8">
                          可容纳人数
                        </nut-col>
                        </div>
                      </div> 
                  </nut-col>
              </div> -->

          </nut-col>
          <nut-col :span="24">
              <!-- <div class="flex-content flex-content-light">span:12</div> -->
          </nut-col>
      </nut-row>
  
    </div>
  </div>
</template>
<script>
  import { mapGetters } from 'vuex'
  import moment from 'moment'
  import { getListApi, getDetailsByIdApi } from '../../api/schedule'
  import { IconUrl } from '../../utils/auxiliary'
  
  export default {
    data () {
      return {
        list1: [],
      }
    },

    async mounted () {
      this.getList()
    },

    methods: {
      goSchedule (id) {
          this.$router.push('/introduce?id=' + id)
      },
      getList() {
        this.$http.post(this.$url + '/inf/venue/list')
        .then(response => {
            this.list1 = response.data.list;
        })
      }
    }
  }
</script>

<style lang="scss">
  body{
    background: #F9F9F9;
  }
  .schedule-list{
    background: #fff;
    border-radius: 5px;
    height: 80px;
    margin-top:1rem;
    padding:0 1rem;
    img{
      width: 60px;
      height: 60px;
      float: left;
      margin-top:10px;
      border-radius: 5px;
    }
    
    .title-content{
      float: left;
      width: 100%;
      margin:10px 0 0 5px;
      padding-top:3px;
      font-size: 14px;
    }
    .title-l{
      margin-top:30px;
      color:#999999;
    }
  }
</style>
